﻿@model OrderModel
@using Telerik.Web.Mvc.UI;

<table class="adminContent">
    <tr>
        <td>
            @(Html.Telerik().Grid<OrderModel.OrderNote>().Name("ordernotes-grid")
        .DataKeys(keys =>
        {
            keys.Add(x => x.Id).RouteKey("orderNoteId");
            keys.Add(x => x.OrderId).RouteKey("orderId");
        })
        .DataBinding(binding =>
        {
            binding.Ajax().Select("OrderNotesSelect", "Order", new { orderId = Model.Id })
                .Delete("OrderNoteDelete", "Order");
        })
        .Columns(columns =>
        {
            columns.Bound(x => x.CreatedOn).Width(100);
            columns.Bound(x => x.Note).Encoded(false).Width(500);
            columns.Bound(x => x.DisplayToCustomer).Width(100);
            columns.Command(commands =>
            {
                commands.Delete().Text(T("Admin.Common.Delete").Text);
            }).Width(180).Title(T("Admin.Common.Delete").Text);
        })
        .EnableCustomBinding(true))
        </td>
    </tr>
</table>
<p>
    <strong>
        @T("Admin.Orders.OrderNotes.AddTitle")
    </strong>
</p>
<table class="adminContent">
    <tr>
        <td class="adminTitle">
            @Html.NopLabelFor(model => model.AddOrderNoteMessage)
        </td>
        <td class="adminData">
            @Html.TextAreaFor(model => model.AddOrderNoteMessage, new { style = "Width: 350px; Height: 150px;" })
            @Html.ValidationMessageFor(model => model.AddOrderNoteMessage)
        </td>
    </tr>
    <tr>
        <td class="adminTitle">
            @Html.NopLabelFor(model => model.AddOrderNoteDisplayToCustomer)
        </td>
        <td class="adminData">
            @Html.EditorFor(model => model.AddOrderNoteDisplayToCustomer)
            @Html.ValidationMessageFor(model => model.AddOrderNoteDisplayToCustomer)
        </td>
    </tr>
    <tr>
        <td colspan="2" align="left">
            <input type="button" id="addOrderNote" class="t-button" value="@T("Admin.Orders.OrderNotes.AddButton")" />
        </td>
    </tr>
</table>

<script type="text/javascript">
    $(document).ready(function () {
        $('#addOrderNote').click(function () {
            var orderNoteMessage = $("#@Html.FieldIdFor(model => model.AddOrderNoteMessage)").val();
                var orderNoteDisplayToCustomer = $("#@Html.FieldIdFor(model => model.AddOrderNoteDisplayToCustomer)").is(':checked');
                $('#addOrderNote').attr('disabled', true);
                $.ajax({
                    cache:false,
                    type: "POST",
                    url: "@(Url.Action("OrderNoteAdd", "Order"))",
                    data: { "DisplayToCustomer": orderNoteDisplayToCustomer, "message": orderNoteMessage, "orderId": @Model.Id },
                    success: function (data) {
                        var ordernotesGrid = $("#ordernotes-grid");
                        ordernotesGrid.data('tGrid').ajaxRequest();
                        $('#addOrderNote').attr('disabled', false);
                    },
                    error:function (xhr, ajaxOptions, thrownError){
                        alert('Failed to add order note.');
                        $('#addOrderNote').attr('disabled', false);
                    }  
                });
            });
        });
</script>
